<template>
  <div class="profile-money-info">
    <div class="my-balance">
      <div class="balance text-color">0.00<span>元</span></div>
      <div class="balance-title">我的余额</div>
    </div>
    <div class="my-discounts">
      <div class="discounts text-color">0.00<span>元</span></div>
      <div class="discounts-title">我的优惠</div>
    </div>
    <div class="my-integral">
      <div class="integral text-color">0.00 <span>分</span></div>
      <div class="integral-title">我的积分</div>
    </div>
  </div>
</template>

<script>
export default {};
</script>

<style scoped>
.profile-money-info {
  display: flex;
  padding: 20px 0;
  justify-content: space-around;
  text-align: center;
}
.profile-money-info > div {
  flex: 1;
  padding: 15px 0;
  font-size: 14px;
}
.profile-money-info > div:nth-child(2){
  border-left: 1px solid #f0f0f0;
  border-right: 1px solid #f0f0f0;
}
.profile-money-info > div .text-color{
  font-size: 18px;
  color: var(--color-high-text);
  font-weight: bold;
}
.profile-money-info > div .text-color span{
  font-size: 16px;
  font-weight: normal;
  color:var(--color-text);
}
</style>